<template>
  <div class="right">
    <p>这是一个Right的组件内容</p>
    <button @click="sendData">子传父</button>
  </div>
</template>

<script setup>
import myBus from "@/myBus"
myBus.on("myClick", value => {
  console.log("myClick接收到了", value)
})
// 在这样的结构中,定义的变量或是函数,可以直接使用,不需要return
</script>

//
<script>
// import { defineEmits } from "vue"
// // 适应defineEmits来接收父组件传来的自定义事件
// // 不过由于defineEmits使用频率较高,可以不用引入,因为vue3将这个组合式的API变成内置的
// export default {
//   name: "Right",
//   setup() {
//     // setup中是一开始无法使用this
//     function sendData() {
//       let emits = defineEmits(["getData"])
//       console.log(111)
//       console.log(this)
//       emits("getData", 123)
//     }
//     return {
//       sendData,
//     }
//   },
// }
//
</script>

<style>
.right {
  width: 500px;
  height: 260px;
  background-color: orange;
}
</style>
